<template>
  <div>
    <div class="body-cont">
      <div class="card-shadow">
        <div class="weui-cell area-box">
          <view class="weui-cell__hd">
            <view class="weui-label">姓名：</view>
          </view>
          <view class="weui-cell__bd">{{empInfo.employeeName}}</view>
        </div>
      </div>
      <div class="card-shadow">
        <div class="weui-cell area-box">
          <view class="weui-cell__hd">
            <view class="weui-label">联系方式：</view>
          </view>
          <view class="weui-cell__bd">{{empInfo.phone}}</view>
        </div>
      </div>
      <div class="card-shadow">
        <div class="weui-cell area-box">
          <view class="weui-cell__hd">
            <view class="weui-label">所在地区：</view>
          </view>
          <view class="weui-cell__bd">{{empInfo.area ? empInfo.area.treeNames : ''}}</view>
        </div>
      </div>
      <div class="card-shadow">
        <div class="weui-cell area-box">
          <view class="weui-cell__hd">
            <view class="weui-label">详细地址：</view>
          </view>
          <view class="weui-cell__bd">{{empInfo.address}}</view>
        </div>
      </div>
    </div>
    <div class="bottom-btn-box text-center">
      <view class="btn-light" @tap="logOut">退出账号</view>
    </div>
  </div>
</template>
<script>
import {mapState} from 'vuex'
import cookie from '@/utils/cookie'

export default {
  components: { },
  data () {
    return {

    }
  },
  computed: {
    ...mapState([
      'empInfo'
    ])
  },
  methods: {
    logOut () {
      uni.showModal({
        title: '退出账号',
        content: '确定要退出此账号吗？',
        success: res => {
          if (res.confirm) {
            cookie.clearCookie()
            this.checkLogin()
          }
        }
      })

    }
  },
  beforeMount () {
    this.checkLogin()
  }
}
</script>
<style lang="less">
page {
  background-color: #f9f9f9;
}
.card-shadow {
  margin-bottom: 30upx;
  .weui-label {
    width: 140upx;
  }
}
.bottom-btn-box {
  padding: 44upx;
}
</style>